<template>
  <div id="footer">
      <footer>
          <el-row :gutter="20">
              <el-col :span="3">
                  <ul>
                      <li><h4>订购方式</h4></li>
                      <li>在线订购</li>
                      <li>电话订购</li>
                      <li>上门订购</li>
                      <li>大客户团体订购</li>
                      <li>大麦超级票订购</li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>配送方式</h4></li>
                      <li>送货上门</li>
                      <li>电子票</li>
                      <li>上门自取</li>
                      <li>大麦自助机换票</li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>支付方式</h4></li>
                      <li>在线支付</li>
                      <li>柜台付款</li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>大麦网微信</h4></li>
                      <li>
                          <img src="/img/footerVue/p_code.jpg" alt="">
                      </li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>大麦网触屏版</h4></li>
                      <li>
                          <img src="/img/footerVue/p_code.jpg" alt="">
                      </li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>账户安全</h4></li>
                      <li>找回密码</li>
                      <li>账户注册</li>
                      <li>账户绑定</li>
                      <li>SSL安全证书</li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>配送方式</h4></li>
                      <li>发票帮助</li>
                      <li>发票帮助</li>
                      <li>订票服务条款</li>
                  </ul>
              </el-col>
              <el-col :span="3">
                  <ul>
                      <li><h4>特色服务</h4></li>
                      <li>特色服务</li>
                  </ul>
              </el-col>
          </el-row>
          <el-row>
              <div class="border"></div>
          </el-row>
          <el-row>
              <p>公司介绍 | 品牌识别 | 企业荣誉 | 隐私声明 | 联系及合作 | 招聘信息 | 网站地图 | 友情链接 | 公司大事记</p>
          </el-row>
          <el-row>
              <p>
                  <img src="/img/footerVue/piao.png">
                  <img src="/img/footerVue/dzyy.png">
                  <img src="/img/footerVue/siteseal_gd_3.gif">
                  <img src="/img/footerVue/pci.png">
                  <img src="/img/footerVue/chengxin.png">
                  <img src="/img/footerVue/xin.png">
              </p>
          </el-row>
      </footer>
  </div>
</template>

<script>
export default {
  data() {
    return {

    }
  }
}
</script>
<style scoped>
#footer{
    background-color: #E6E6E6;
}
footer{
    width: 90%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    padding: 20px;
}

.border{
    border: 0;
    width: 100%;
    height: 2px;
    background-color: #FF3C1B;
    margin: 20px 0px;
}
footer li{
    font-size: 14px;
    height: 30px;
    line-height: 30px;
}
footer p{
    font-size: 20px;
    text-align: center;
}
footer p img{
    margin: 10px 16px;
}
</style>